<template>
	<view class="container">
		<u-navbar title='收银台' :title-bold='true' :border-bottom='false' ></u-navbar>
		
		<view class="price">
			￥{{price}}
		</view>
		<view class="payStyle">
			<span>微信支付</span>
			<image src="../../static/choose.png" mode=""></image>
		</view>
		<u-line />
		<view class="btn" @click="pay">
			确认支付￥{{price}}
		</view>
		

	</view>
</template>

<script>
	import {payOrder,zeroPay,addCoupon} from '@/api/index.js'
	export default{
		data(){
			return{
				order_id:'',
				price:'',
				order:'',
				payData:{},
				use_coupon_id:''
			}
		},
		onLoad(e) {
			if(e.price) this.price=e.price
			if(e.orderId) this.order_id=e.orderId
			this.init()
		},

		methods:{
			init(){
				let that=this
				if(that.price>0){
					payOrder({order_id:this.order_id}).then(res=>{
						if(res.code==1){
							that.payData={
								provider: 'wxpay',...res.data.payData
							}
						}else{
							uni.showToast({
								title:res.msg,
								icon:'none'
							})
						}
					})
				}
				
			},
			pay(){
				let that = this
				if(this.price>0){
					uni.requestPayment({
						...this.payData,
						success: function (res) {
							console.log('success:' + JSON.stringify(res));
							uni.redirectTo({
								url:'/sub/center/mine/umbrella'
							})
						},
						fail: function (err) {
							uni.showToast({
								title:'支付失败',
								icon:'none'
							})
							console.log('fail:' + JSON.stringify(err));
						}
					});
				}else{
					zeroPay({order_id:this.order_id}).then(res=>{
						uni.showToast({
							title:res.msg,
							icon:'none',
							duration:2000,
							success(){
								setTimeout(()=>{
									if(res.code==1){
										uni.redirectTo({
											url:'/sub/center/mine/umbrella'
										})
									}
								},2000)
							}
						})
						
					})
				}
				
			}
		}
	}
</script>

<style lang="less" >

	.container{
		background-color: #FFF;
		height: 100vh;
		font-size: 16px;
		.price{
			width: 100%;
			text-align: center;
			padding: 40px 0;
			color: #E2202B;
			font-weight: 500;
			font-size: 24px;
		}
		.payStyle{
			display: flex;
			justify-content: space-between;align-items: center;
			width: 90vw;
			margin: 0 auto;
			margin-bottom: 20px;
			image{
				height: 16px;
				width: 16px;
			}
		}
		.btn{
			background-color: #4CAE47;
			border-radius: 30px;
			margin-top: 60px;
		}
	}
</style>